@import "../../css/Drawer.less";

@esui-drawer-mask-background: rgba(56, 56, 56, 0.5);
@esui-drawer-header-background: @esui-palette-neutral-color;
@esui-drawer-title-color: @esui-palette-primary-color;
@esui-drawer-close-color: @esui-palette-muted-color;
@esui-drawer-close-hover-color: @esui-palette-color;
@esui-drawer-content-background: @esui-palette-white;
@esui-drawer-footer-backround: @esui-palette-white;
@esui-drawer-footer-top-border: 1px solid @esui-palette-border;

.esui-drawer-mask-theme() {
    background: @esui-drawer-mask-background;
}

.esui-drawer-header-theme() {
    background: @esui-drawer-header-background;
    .opacity(90);
}

.esui-drawer-footer-theme() {
    background: @esui-drawer-footer-backround;
    border-top: @esui-drawer-footer-top-border;
    .opacity(80);
}

.esui-drawer-title-theme() {
    color: @esui-drawer-title-color;
}

.esui-drawer-close-theme() {
    font-size: 1.5em;
    width: 2em;
    color: @esui-drawer-close-color;
    &:hover {
        color: @esui-drawer-close-hover-color;
    }
}

.esui-drawer-content-theme() {
    background: @esui-drawer-content-background;
}